<template>
    <div>
        <Row type="flex" justify="center" align="middle">
            <Col span="24">
                <Form ref="searchForm" :model="searchData" inline>
                  <Col span="20">
                    <Row>
                      <Form-item prop="wname">
                          <Input type="text" style="width:150px" v-model="searchData.wname" placeholder="会员姓名">
                          </Input>
                      </Form-item>
                      <Form-item prop="telno">
                          <Input type="text" style="width:150px" v-model="searchData.telno" placeholder="电话号码">
                          </Input>
                      </Form-item>
                      <Form-item prop="isactive">
                          <Select v-model="searchData.isactive" style="width:100px" placeholder="状态">
                            <Option value="">全部</Option>
                              <Option value="0">{{ $t('isactive_0') }}</Option>
                              <Option value="1">{{ $t('isactive_1') }}</Option>
                          </Select>
                      </Form-item>
                      <Form-item prop="ispass">
                          <Select v-model="searchData.ispass" style="width:100px" placeholder="审核状态">
                              <Option value="">全部</Option>
                              <Option value="0">{{ $t('ispass_0') }}</Option>
                              <Option value="1">{{ $t('ispass_1') }}</Option>
                              <Option value="2">{{ $t('ispass_2') }}</Option>
                          </Select>
                      </Form-item>
                      <Form-item prop="releaseUser">
                          <Date-picker v-model="searchData.createdate" format="yyyy-MM-dd HH:mm:ss" type="datetimerange" placement="bottom-end"
                          placeholder="选择日期" style="width: 400px" @on-change="createdateChange"></Date-picker>
                      </Form-item>
                      <Form-item>
                          <Button type="primary" @click="selectmore=!selectmore" v-if="!selectmore">更多</Button>
                      </Form-item>
                    </Row>
                    <Row v-if="selectmore">
                      <Form-item prop="code">
                          <Input type="text" style="width:150px" v-model="searchData.code" placeholder="编码">
                          </Input>
                      </Form-item>
                      <Form-item prop="worktype" >
                          <Input type="text" style="width:150px" v-model="searchData.worktype" placeholder="工种">
                          </Input>
                      </Form-item>
                      <Form-item prop="releaseUser">
                          <Input type="text" style="width:150px" v-model="searchData.releaseUser" placeholder="代发人">
                          </Input>
                      </Form-item>
                      <Form-item>
                          <Button type="primary" @click="selectmore=!selectmore">简略</Button>
                      </Form-item>
                    </Row>
                  </Col>
                  <Col span="2">
                    <Form-item>
                        <Button type="primary" @click="search" :loading="loading">
                          <span v-if="!loading">搜索</span>
                          <span v-else>加载中</span>
                        </Button>
                    </Form-item>
                  </Col>
                </Form>
                <Col span="24">
                  <Button type="primary" @click="passsuccess" :loading="loading1">
                    <span v-if="!loading1">批量审核通过</span>
                    <span v-else>正在处理</span>
                  </Button> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  <Button type="warning" @click="passfail"  :loading="loading2">
                    <span v-if="!loading2">批量审核失败</span>
                    <span v-else>正在处理</span>
                  </Button>
                </Col>

            </Col>
            <Col span="24">
                <Table :columns="column" :data="list"  @on-selection-change="setpasslistchange"></Table>
                <Page :total="pagedata.total" size="small" :current="pagedata.current" :page-size="pagedata.pageSize" :page-size-opts="pagedata.pageSizeOpts"
                    @on-change="pageChange" @on-page-size-change="sizeChange"
                show-elevator show-sizer show-total></Page>
            </Col>
        </Row>
        <Modal v-if="detailinfo" v-model="showdetail" title="详细" width="1000">
          <Row>
            <Col span="24">
              <Card >
                <p slot="title">
                  用户信息
                </p>
                  <Row>
                    <Col span="8">
                        <p>创建人：{{detailinfo.coninfo.wname}}</p>
                        <p>性别：{{detailinfo.coninfo.gender}}</p>

                    </Col>
                    <Col span="8">
                        <p>已实名：{{detailinfo.coninfo.is_realauth?'否':'是'}}</p>
                        <p>年龄：{{detailinfo.coninfo.wage}}</p>
                    </Col>
                    <Col span="8">
                        <p>电话：{{detailinfo.coninfo.telno}}</p>
                        <p>代发人：{{detailinfo.release_user}}</p>
                    </Col>
                  </Row>
              </Card>
            </Col>
            <Col span="24">
                <Card >
                  <p slot="title">
                    招工信息 编号：{{detailinfo.code}}
                  </p>
                    <Row>
                      <Col span="6">
                        <p>招工状态：{{ $t('isactive_'+detailinfo.isactive) }}</p>
                      </Col>
                      <Col span="6">
                        <p>审核状态：{{ $t('ispass_'+detailinfo.ispass) }}</p>
                      </Col>
                      <Col span="6">
                        <p>日工资：{{detailinfo.daysalary}}</p>
                      </Col>
                      <Col span="6">
                        <p>工种：{{detailinfo.worktype}}</p>
                      </Col>
                      <Col span="6">
                       <p>最大联系次数：{{detailinfo.maxconcount}}</p>
                      </Col>
                      <Col span="6">
                       <p>已联系次数：{{detailinfo.concount}}</p>
                      </Col>
                      <Col span="6">
                       <p>创建时间：{{detailinfo.createdate}}</p>
                      </Col>
                      <Col span="6">
                       <p>关闭时间：{{detailinfo.unactivetime}}</p>
                      </Col>
                      <Col span="24">
                        <p>地址：{{detailinfo.city}}{{detailinfo.disc}}{{detailinfo.town}}{{detailinfo.address}}</p>
                      </Col>
                      <Col span="24">
                        <p>简介：{{detailinfo.disstr}}</p>
                      </Col>
                      <Col span="24">
                        <p>详细：{{detailinfo.info}}</p>
                      </Col>
                    </Row>
                </Card>
            </Col>
        </Row>
        </Modal>
    </div>
</template>
<script>
/***
 * {
          title: '编码',
          key: 'code'
        },
 */
import { getinventlist, inventunactive, updateispassbyid, getinventinfo } from '@/api/work'
export default {
  name: 'inventlist',
  data () {
    var self = this
    return {
      loading1: false,
      loading2: false,
      loading: false,
      selectmore: false,
      showdetail: false,
      detailinfo: false,
      wuid: this.$store.state.user.userId,
      list: [],
      column: [
        {
          type: 'selection',
          width: 40,
          align: 'center'
        },
        {
          title: 'ID',
          key: 'id',
          width: 80
        },
        {
          title: '编码',
          key: 'code',
          width: 150
        },
        {
          title: '会员姓名',
          key: 'wname',
          render: function (h, params) {
            const wname = params.row.wname ? params.row.wname : ''
            const telno = params.row.coninfo.telno ? params.row.coninfo.telno : ''
            const html = '<p>用户名：' + wname + '</p><p>电话：' + telno + '</p>'
            var div = h('div', {
              domProps: {
                innerHTML: html
              }
            })
            return div
          }
        },
        {
          title: '日工资',
          key: 'daysalary',
          sortable: true,
          width: 100
        },
        {
          title: '联系数量',
          key: 'concount',
          sortable: true,
          width: 120
        },
        {
          title: '工种',
          key: 'worktype',
          width: 80
        },
        {
          title: '状态',
          key: 'isactive',
          width: 160,
          render: function (h, params) {
            const active = self.$t('isactive_' + params.row.isactive)
            const pass = self.$t('ispass_' + params.row.ispass)
            const html = '<p>发布状态：' + active + '</p><p>审核状态：' + pass + '</p>'
            var div = h('div', {
              domProps: {
                innerHTML: html
              }
            })
            return div
          }
        },
        {
          title: '创建时间',
          key: 'createdate',
          render: function (h, params) {
            const createdate = params.row.createdate ? params.row.createdate : ''
            const passtime = params.row.passtime ? params.row.passtime : ''
            const unactivetime = params.row.unactivetime ? params.row.unactivetime : ''
            const html = '<p>创建时间：' + createdate + '</p><p>审核时间：' + passtime + '</p><p>关闭时间：' + unactivetime + '<p>'
            var div = h('div', {
              domProps: {
                innerHTML: html
              }
            })
            return div
          }
        },
        {
          title: '代发人',
          key: 'release_user',
          width: 80
        },
        {
          title: '操作',
          key: 'option',
          align: 'left',
          width: 200,
          render: function (h, params) {
            var btn2 = h('Button', {
              props: {
                type: 'text',
                size: 'small'
              },
              on: {
                click: (data) => {
                  self.$router.push({ path: 'release', query: { id: params.row.id, edit: true } })
                }
              }
            }, '修改')
            var btn1 = h('Button', {
              props: {
                type: 'text',
                size: 'small'
              },
              on: {
                click: (data) => {
                  // self.$router.push({ path: 'release', query: { id: params.row.id, edit: false } })
                  self.showdetailinfo(params.row.id)
                }
              }
            }, '查看')
            var btn3 = h('Button', {
              props: {
                type: 'warning',
                size: 'small'
              },
              on: {
                click: (data) => {
                  const wuid = self.wuid
                  const id = params.row.id
                  inventunactive({ id, wuid }).then(res => {
                    const data = res.data
                    if (data.code === 200) {
                      self.$Message.success('操作成功')
                      self.getList()
                    } else {
                      self.$Message.error(data.msg)
                    }
                  })
                }
              }
            }, '关闭')
            var btns = []
            btns.push(btn1)
            btns.push(btn2)
            if (params.row.isactive === 1) {
              btns.push(btn3)
            }
            return btns
          }
        }
      ],
      searchData: {
        telno: '',
        code: '',
        isactive: '',
        ispass: '',
        releaseUser: '',
        wname: '',
        worktype: '',
        createdate: []
      },
      pagedata: {
        total: 10,
        current: 1,
        pageSize: 10,
        pageSizeOpts: [10, 50, 100]
      },
      passlist: []
    }
  },
  methods: {
    search () {
      this.pagedata.current = 1
      this.getList()
    },
    getList () {
      this.loading = true
      this.searchData.page = this.pagedata.current
      this.searchData.size = this.pagedata.pageSize
      getinventlist(this.searchData).then(res => {
        const data = res.data
        if (data.code !== 200) {
          this.$Message.error(data.msg)
          this.list = []
          this.pagedata.total = 0
          this.pagedata.current = 1
        } else {
          const usedata = data.data
          this.pagedata.total = usedata.count
          this.list = usedata.list
        }
        this.loading = false
      })
    },
    pageChange (current) {
      this.pagedata.current = current
      this.getList()
    },
    sizeChange (pageSize) {
      this.pagedata.pageSize = pageSize
      this.pagedata.current = 1
      this.getList()
    },
    passsuccess () {
      if (this.passlist.length <= 0) {
        this.$Message.error('无提交数据')
        return false
      }
      this.loading1 = true
      const idlist = this.passlist
      const ispass = 1
      const wuid = this.wuid
      updateispassbyid({ idlist, ispass, wuid }).then(res => {
        const data = res.data
        if (data.code !== 200) {
          this.$Message.error(data.msg)
        } else {
          this.getList()
        }
        this.loading1 = false
      })
    },
    passfail  () {
      if (this.passlist.length <= 0) {
        this.$Message.error('无提交数据')
        return false
      }
      this.loading2 = true
      const idlist = this.passlist
      const ispass = 2
      const wuid = this.wuid
      updateispassbyid({ idlist, ispass, wuid }).then(res => {
        const data = res.data
        if (data.code !== 200) {
          this.$Message.error(data.msg)
        } else {
          this.getList()
        }
        this.loading2 = false
      })
    },
    setpasslistchange (selection) {
      if (selection.length >= 0) {
        this.passlist = []
      }
      for (var j = 0, len = selection.length; j < len; j++) {
        this.passlist.push(selection[j].id)
      }
    },
    showdetailinfo (id) {
      getinventinfo(id).then(res => {
        const data = res.data
        if (data.code !== 200) {
          this.$Message.error(data.msg)
        } else {
          const usedata = data.data
          this.detailinfo = usedata
          this.showdetail = true
        }
      })
    },
    createdateChange (values) {
      this.searchData.createdate = values
    }
  },
  mounted () {
    this.getList()
  }
}
</script>
